<template>
	<div class="container">
		<common-header :title="title"></common-header>
		<search-input @onSearch="onSearch"></search-input>
		<search-scroll-wrapper 
			:searchDatas="searchDatas"
			:showScrollwrapper="showScrollWrapper"
		></search-scroll-wrapper>
	</div>
</template>

<script>
import CommonHeader from 'components/Header/Common';
import SearchInput from 'components/SearchInput/Index';
import SearchScrollWrapper from 'components/ScrollWrapper/Search';

import tools from 'utils/tools.js';

export default {
	name: 'Search',
	components: {
		CommonHeader,
		SearchInput,
		SearchScrollWrapper
	},
	data() {
		return {
			title: '商家搜索',
			searchDatas: {},
			showScrollWrapper:false
		}
	},
	methods: {
		onSearch(res) {
			if (res && res.status === 0) {
				const data = res.data;
				this.showScrollWrapper = true;

				data.foodDatas = tools.formatJSON(data.foodDatas, 'keyword');
				this.searchDatas = res.data;
			} else {
				this.showScrollWrapper = false;
				this.searchDatas = res;
			}
		}
	}
}
</script>

<style>

</style>